<template>
  <div class="proShow">
    <div class="proShowFlex">
      <special-tier :data="showData[0]" class="singleShowCom"   />
      <div v-for="(item,index) in showData" class="singleShowCom">
        <common-tier v-if="index != 0" :data="showData[index]"/>
      </div>
    </div>
  </div>
</template>

<script>
  import commonTier from "./commonTier";
  import specialTier from "./specialTier";

  export default {
    name: "proShowBox",
    components: {
      commonTier,
      specialTier
    },
    props: {
      data: {
        type: Array
      }
    },
    data(){
      return {
        showData: this.data
      }
    },
    methods: {

    }
  }
</script>

<style scoped>
  .proShowFlex{
    display: flex;
    flex-wrap: wrap;
    width: 95%;
  }
  .singleShowCom{
    margin-left: 3%;
    margin-bottom: 3%;
  }
</style>
